<template>
    <div>
        <div class="item" v-for="(item,index) of list">
            <div class="item-tittle border-bottom">
                <span class="item-title-icon"></span>
                {{item.title}}
            </div>
            <!-- <div v-for="(cont,index) of item.children">
                {{cont.title}}
            </div> -->
            <div v-for="(cont,index) of item.children" class="item-chilren">
                <span class="item-title-icon"></span>
                {{cont.title+cont.shop}}
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "DetailList",
        props:{
            list:Array
        }
    }
</script>

<style lang="stylus" scoped>
.item
    line-height 0.8rem
    font-size: 0.32rem
    .item-title-icon
        position relative
        left 0.2rem
        top 0.06rem
        display: inline-block;
        width: .36rem;
        height: .36rem;
        background: url(//s.qunarzz.com/piao/image/touch/sight/detail.png) 0 -.45rem no-repeat;
        margin-right: .3rem;
        background-size: .4rem 3rem;
    .item-chilren
        padding-left 0.2rem
        
</style>


